<!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
        <title>Drag Zoom</title>
        <style>
          #map {
            width:700px; height:400px; border:1px solid #000;
          }
        </style>
        <script src="http://maps.google.com/maps?file=api&amp;v=2.x&amp;key=ABQIAAAAjU0EJWnWPMv7oQ-jjS7dYxQGj0PqsCtxKvarsoS-iqLdqZSKfxRdmoPmGl7Y9335WLC36wIGYa6o5Q" type="text/javascript">
        </script>
        <script type="text/javascript">
         document.write('<script type="text/javascript" src="../src/keydragzoom'+(document.location.search.indexOf('packed')>-1?'_packed':'')+'.js"><'+'/script>');
        </script>
        <script type="text/javascript">
        var map;    
        function init(){
          map = new GMap2(document.getElementById("map"));
          map.setCenter(new GLatLng(35.227, -80.84), 12);
          map.addControl(new GMapTypeControl());
          map.addControl(new GLargeMapControl());
          map.addControl(new GScaleControl());
          map.enableDoubleClickZoom();
          map.enableContinuousZoom();
          map.enableScrollWheelZoom();
          // drag zoom
          map.enableKeyDragZoom({
            key:'ctrl'
          });
          
        }
        </script>
    </head>
    <body onload="init()">
       <a href='?packed'>Packed </a> | 
       <a href='?'> Unpacked</a> Version of the script.
       
       <br/>
       Hold your <span style="color:red; font-weight:bold" >ctrl</span> key while drag a box
       
        <div id="map" ></div>
       
    </body>
</html>
